<?php session_start();
      $_SESSION['uid']="";
      //echo $_SERVER['QUERY_STRING'];
      // Parse gadget URL and emit <script src=...</script> statements into the HTML output. 
      // The <script src=...</script> statements will load the libraries passed in via the URL.
      $libraries = split(",", $_GET["libs"]);
      foreach ($libraries as $script) {
        if (preg_match('@^[a-z0-9/._-]+$@i', $script)
          && !preg_match('@([.][.])|([.]/)|(//)@', $script)) {
            print "<script src='http://www.google.com/ig/f/$script'></script>";
        }
      } 
?>

<style>
.screenPos{
    position:absolute;
  	left:20px;
	top:65px;
	width:280px;
  	height: 140px;
  	overflow: auto;
}

.screenForm{
  visibility:hidden;
}

.dt{
text-align:left;
}
#g_items_row{
	height: 150px;
	overflow: auto;
	width: 284px;
	
}
.g_del_ico{
	float:left;
	width:10%;
	height: 22px;
	text-align:center;
}
*{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
}
.o_row{
background-color:#FFCCFF
}
.e_row{
background-color:#FF66FF;
}

.g_item{
	height:22px;
	float: left; width: 70%; 
	text-align:left;
}	
.g_amt{
	height:22px;
	float: right; width: 20%; 
	text-align:right;
	}
.g_title_l{
	height:22px;
	width: 100%; 
	background-color:#003399;
	color:#FFFFFF;
}	
.g_title_r{
	background-color:#003399;
	height:22px;
	float: right; width: 30%; 
	text-align:right;
	color:#FFFFFF;
}
.g_footer_r{
	background-color:#003399;
	height:22px;
	float: left; width: 30%; 
	text-align:center;	
	color:#FFFFFF;
}	
.g_footer_l{
	height:22px;
	float: left; width: 70%;
	text-align:center;
	background-color:#003399;
	color:#FFFFFF;
	
}
.g_l_row_l{
	height:22px;
	float: left; width: 70%;
	text-align:right;
}
.g_l_row_r{
	height:22px;
	float: left; width: 30%;
	text-align:right;
}
.hand{
	cursor: pointer;
}
</style>
<script language="javascript" src="js/jquery.js" type="text/javascript"></script>

<link rel="stylesheet" href="css/ui.datepicker.css" type="text/css" media="screen" title="Flora (Default)">
<script src="js/ui.datepicker.js"></script>



<script>
usrid="";
function todayStr() {
  var today=new Date()
  var yr=today.getYear();
  if(yr<1900) {yr+=1900}
  return yr+"-"+(today.getMonth()+1)+"-"+today.getDate();
}

var prefs = new _IG_Prefs();
function updateUserid(){
	$.get("ajax_request.php?request=UPDT_USR&usrid="+$("#accountid").val()+"&emailid="+$("#emailid").val(),function(data){
    $("#emailid").val(data);
	setUsrid() ;
  });
	
	reportingCall();
}
function setUsrid() {  
   usrid = prefs.getInt("userid");
   emailid = prefs.getString("emailid");
   if(usrid==0){
    <?php 	$rid=rand(10000,99999)."".time();   ?>
    prefs.set("userid", <?=$rid?>);
   }
   $("#usr").attr("uid",prefs.getInt("userid"));
   $("#accountid").val(prefs.getInt("userid"));
   $.get("ajax_request.php?request=SETUSR&usrid="+prefs.getInt("userid"),function(data){
    $("#emailid").val(data);
	if($("#emailid").val()==""){
      $("#setting_icon").attr("src","images/key1.gif");
    }else{
      $("#setting_icon").attr("src","images/key2.gif");
   }
  });
}
function loginUser(){

}

function regUser(){
	if($("#reg_emailid").val()==""){
		$("#error_msg").html("Please Enter Your Email ID");
		console.log("Email empty");
		return false;
	}else if($("#reg_password").val()==""){
		$("#error_msg").text("Please Enter Your Password");
		console.log("password empty");
		return false;
	}else if($("#reg_password").val()!=$("#repassword").val()){
		console.log("re password");
		$("#error_msg").text("Password Mismatch");
		return false;		
	}else{
		$.get("ajax_request.php?request=REGUSR&usrid="+$("#accountid").val()+"&emailid="+$("#emailid").val()+"&password="+$("#reg_password").val(),function(data){
    		$("#emailid").val(data);
				setUsrid() ;
  			});
	}
}

function showMe(frmID){
      $(".screenForm").css("visibility","hidden");
      $("#"+frmID).css("visibility","visible");  	
}
function attachEvent(){
$(".g_item").click(function() {
	if(itemEdit=="OFF"){
		itemEdit="ON";
		divID=$(this).attr("id");
		divText=$(this).html();
		if(divText=="Click Here To Update Item"){
			divText="";
		}
		//console.log(divID);
		$(this).html('<input type="text" size="30" maxlength="30" class="g_item_text" id="ti_'+divID+'" >');
		$("#ti_"+divID).focus();
		$("#ti_"+divID).val(divText);
		$("#ti_"+divID).bind("blur",function(){
			txtVal=($("#ti_"+divID).val());
			$("#"+divID).html($("#ti_"+divID).val());
			updateROW("UPDATE_ITEM",txtVal,divID);
			itemEdit="OFF";			
		});
	}
});

$(".g_del_ico").mouseup(function(){
		divID=$(this).attr("id");
		divText=$(this).html();
		divID=divID.split("_")[1];
		delROW("DEL_ITEM",divID);
		$("#row_"+divID).fadeOut();
		decorateRow();
});


$(".g_amt").click(function() {
	if(amtEdit=="OFF"){
		amtEdit="ON";
		divID=$(this).attr("id");
		divText=$(this).html();
		divID=divID.split("_")[1];
		$(this).html('<input align="right" size="6" maxlength="8" type="text" class="g_amt_text" id="ta_'+divID+'" >');
		$("#ta_"+divID).focus();
		$("#ta_"+divID).val(divText);
		$("#ta_"+divID).bind("blur",function(){
			txtVal=$("#ta_"+divID).val();
			$("#a_"+divID).html($("#ta_"+divID).val());
			updateROW("UPDATE_AMT",txtVal,divID);
			amtEdit="OFF";			
		});
	}
});
}



function reportingCall(){
		showMe("g_wait");
			$.ajax({
			url: 'ajax_request.php',
			data: {'request':'LOAD_REPORT','startDt':$("#startDate").val(),'endDt':$("#endDate").val(),'keyword':$("#keyword").val()},
			success: function(data) {
			$('#g_items_row').html(data);
			getTotal();
			decorateRow();
      //?Not working inside attachEvent Chk this//
     $(".add_new").click(function(){
        rdt=$(this).attr("dt") ;
		addItemRow(rdt);
      }); 
			attachEvent();
		 showMe("g_items_row");
		}
	});
}

function addItemRow(rdt){
			$("#additem_icon_"+rdt).attr("src","images/add-wait.gif");
			$.ajax({
			url: 'ajax_request.php',
			data: {'request':'ADD_ITEM', 'date':rdt},
			success: function(data) {
			$('#dt_row_'+rdt).append("<div id=\"row_"+data+"\" class=\"item_row\"><span class=\"g_item\" id=\""+data+"\">Click Here To Update Item</span><span class=\"g_amt\" id=\"a_"+data+"\">0.00</span><span class=\"g_del_ico hand\" id=\"del_"+data+"\">x</span></div>");
       		decorateRow();
        	attachEvent();
        	$('.g_item_text').css("visibility","visible");
			$("#additem_icon_"+rdt).attr("src","images/add-icon.jpg");
			}
	});
}

function getTotal(){
			$.ajax({
			url: 'ajax_request.php',
			data: {'request':'GET_TOTAL','startDt':$("#startDate").val(),'endDt':$("#endDate").val()},
			success: function(data) {
			$('#total_amt').html(data);
		}
	});
}

function updateROW(req,txt,id){
			$.ajax({
			url: 'ajax_request.php',
			data: {'request':req,'id':id,'txt':txt}
	});
	getTotal();
}

function delROW(req,id){
			$.ajax({
			url: 'ajax_request.php',
			data: {'request':req,'id':id}
	});
	getTotal();
}

function decorateRow(){
    $('.g_item').removeClass('o_row');
    $('.g_item').removeClass('e_row');
	$('.g_item:odd').addClass('o_row');
    $('.g_item:even').addClass('e_row');
	
    $('.g_amt').removeClass('o_row');
    $('.g_amt').removeClass('e_row');
	$('.g_amt:odd').addClass('o_row');
    $('.g_amt:even').addClass('e_row');
   
    $('.g_del_ico').removeClass('o_row');
    $('.g_del_ico').removeClass('e_row');
	$('.g_del_ico:odd').addClass('o_row');
    $('.g_del_ico:even').addClass('e_row');


		$('.g_item_text').css("visibility","hidden");
}

$(document).ready(function(){
    showMe("g_items_row"); 
    addItem="OFF";
    setUsrid();

    $("#startDate").val(todayStr()); 
    $("#endDate").val($("#startDate").val());
    $("#report_date").html($("#startDate").val());
   
   $("#report").click(function(){
      showMe("calendar");
    });

    $("#help").click(function(){
        showMe("helpDoc");
    });
	$("#home").click(function(){
        showMe("g_items_row");
    });
    
   $("#usr").click(function(){
        showMe("setting");
    });
    $("#show_login").click(function(){
        showMe("login");
    });
	$("#show_reg").click(function(){
        showMe("reg");
    });
	
    $("#help_ok").click(function(){
        showMe("g_items_row");  
    });
    
    $("#setting_ok").click(function(){
    prefs.set("userid", $("#accountid").val());
		updateUserid();
    });
	
	$("#reg_ok").click(function(){
        regUser();
    });
	
    
    $("#date_ok").click(function(){
           
     if($("#startDate").val()!=$("#endDate").val()){
       $("#report_date").html($("#startDate").val()+" To "+$("#endDate").val());
       }else{
       $("#report_date").html($("#startDate").val());
       }
       
	   reportingCall(); 
  	});
	$("#export_ok").click(function(){
    	$("#export_link").attr("href","csv_export.php?userid="+$("#accountid").val()+"&stDate="+$("#startDate").val()+"&endDate="+$("#endDate").val());       
   	});

    $("#startDate,#endDate").datepicker({ 
	   dateFormat: 'yy-mm-dd',
	    beforeShow: $.datepicker.customRange, 
        showOn: "both", 
        buttonImage: "images/calendar.gif", 
        buttonImageOnly: true 
    });

itemEdit="OFF";
amtEdit="OFF";
showMe("g_wait");
reportingCall();

});
</script>


<!-- Daily Expense Tracker -->
<table  width="300" cellspacing="0" cellpadding="0" border=0>
<tr>
	<td style="background-image: url(images/tl.gif); width: 8px; height: 28px;"/></td>
	<td id="gad_title" style="background-image: url(images/tt.gif); width: auto; height: 28px; text-align: center;"><strong>Daily Expense Tracker</strong></td>
	<td style="background-image: url(images/tr.gif); width: 8px; height: 28px;"/></td>
</tr>
<tr>
<td style="background-image: url(images/l.gif); width: 8px; height: auto;"></td>
<td>

<!--##########################################################Setting################################################################-->
<div id="setting" style="visibility:hidden;" class="screenPos screenForm">
<center>
<strong>Register Your Account</strong><br>
<div id="error_msg">&nbsp;</div>
AccountID: <input readonly="readonly" type="text" id="accountid" name="account_id"><br><br>
<span id="">WORKING ON IT <br>(you can still use this gadget)</span><br><br>
<span id="show_login">[Login]</span><br><br>
<span id="show_reg">[Register]</span><br><br>
<!--<span id="setting_ok"> <img src="images/update-icon.jpg"></span>-->
</center>
<br>If you want to get same daily expense data at your second daily expense gadget then please note this account id and update it to your other gadget.<br>
</div>
<!--##########################################################Setting##########################################################-->
<!--##########################################################Account Registration################################################################-->
<div id="reg" style="visibility:hidden;" class="screenPos screenForm">
<center>
<strong>Login to your Account</strong><br>
<div id="error_msg">&nbsp;</div>
Email ID:&nbsp;&nbsp;&nbsp; <input type="text" id="log_emailid" name="log_email_id"><br><br>
Password:&nbsp;<input type="password" id="log_password" name="log_password"><br><br>
<span id="login_ok"> <img src="images/ok-icon.jpg"></span><br><br>

<strong>Register Your Account</strong><br>
<div id="error_msg">&nbsp;</div>
Email ID:&nbsp;&nbsp;&nbsp; <input type="text" id="reg_emailid" name="reg_email_id"><br><br>
Password:&nbsp;<input type="password" id="reg_password" name="reg_password"><br><br>
Re-Type:&nbsp;&nbsp;&nbsp; <input type="password" id="repassword" name="repassword"><br><br>
<span id="reg_ok"> <img src="images/ok-icon.jpg"></span><br><br>

</center>
<br>If you want to get same daily expense data at your second daily expense gadget then please note this account id and update it to your other gadget.<br>
</div>
<!--##########################################################Account Login##########################################################-->

<!--########################################################## HELP ##########################################################-->
<div id="helpDoc" style="visibility:hidden;" class="screenPos screenForm">
<ul>
<li><strong>Add Item: </strong>Click [<img src="images/add-icon.jpg">]. Editable empty row will be added.</li>
<li><strong>Delete Item: </strong>Click [x].</li>
<li><strong>Update Item: </strong>Click and Update the text.</li>
<li><strong>Report: </strong>Click [Cal icon] and select date range to view the report.</li>
<li><strong>Export: </strong>Click [Cal icon] and Your Can export your data in CSV format on selected date range.</li>
<li><strong>Note: </strong>Your System date will be shown/taken as today's date.</li>
<li><strong>Note: </strong>Don't put this gadget in publicly accessible  pages.</li>
<li><strong>Note: </strong>Gadget is for personal use only. For customization plz contact us. <a href="http://www.eddytools.com/index.php?page=google-gadget" target="_blank">know more</a>
<li><strong>Note: </strong>In case of any issue feel free to contact me. But I am not liable for that.</li>
</ul>
<center><span id="help_ok"> <img src="images/ok-icon.jpg "></span></center>
</div>
<!--########################################################## HELP ##########################################################-->
<!--########################################################## CALENDAR ##########################################################-->
<div id="calendar" style="visibility:hidden" class="screenPos screenForm">
<br><br>
<center>
Search:<input type="text" size="20" value="" id="keyword"/>(Opt)<br><br>
<input type="text" size="10" value="" id="startDate"/> to <input type="text" size="10" value="" id="endDate"/> 
<script type="text/javascript"> 
function customRange(input) { 
    return {minDate: (input.id == "endDate" ? $("#startDate").datepicker("getDate") : null), 
        maxDate: (input.id == "startDate" ? $("#endDate").datepicker("getDate") : null)}; 
} 
</script>
<br /><center><span id="date_ok"><img src="images/ok-icon.jpg    "  ></span></center><br><br>
<center><span id="export_ok"><a id="export_link" href="#">[CSV Export]</a></span></center>
</div>
<!--########################################################## CALENDAR ##########################################################-->
<!--########################################################## LOADING ##########################################################-->
<div id="g_wait" style="visibility:hidden" class="screenPos screenForm">
<br><br>
<center>
<br />
<img src="images/report-loader.gif">
</center>
</div>
<!--########################################################## LOADING ##########################################################-->



<div>
<div>	
<div class="g_title_l"><strong>ITEMS &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;AMOUNT</strong></div></div> 
<!-- -->
<div id="g_items_row" class="screenForm"></div>
<!-- -->
<div><div class="g_l_row_l" ><span id="home" class="hand"><img src="images/home.gif"></span>&nbsp;<span id="help" class="hand"><img src="images/help-icon.jpg"></span>&nbsp;<span id="usr" uid="000" class="hand"><img id="setting_icon" src="images/key1.gif"></span>&nbsp;<strong>Total:</strong></div>

<div class="g_l_row_r" ><strong><span id="total_amt">00.00</span></strong></div></div>
<div><div class="g_footer_l"><strong><span id="report_date">09-Aug-08</span></strong></div>
		<div class="g_footer_r"><strong><span center id="report" class="hand"><img src="images/calendar.gif"></span></strong></div>
		</div>
</div>
</td>

<td style="background-image: url(images/l.gif); width: 8px; height: auto;"></td>
</tr>

<tr>
<td style="background-image: url(images/bl.gif); width: 8px; height: 28px;"/>
<td style="background-image: url(images/b.gif); width: auto; height: 28px;" align="right"><a href="http://www.eddytools.com/tools/google-gadget.htm" border="0" target="_blank"><img border="0" src="images/eddytools_trans_small.png"></a></td>
<td style="background-image: url(images/br.gif); width: 8px; height: 28px;"/>
</tr>
</table>
<!-- Daily Expense Tracker -->
<script>
var ga = new _IG_GA("UA-5353841-2");
ga.reportPageview('/view/dailyExpenseGadget');

</script>
